var $ = layui.$;
var layer = layui.layer

axios.get('http://localhost:9000/goods/category').then(res => {
  if (res.data.code === 1) {
    var html = ''
    res.data.list.forEach((item, index) => {
      $('.category').append(`<li>${item}</li>`);
    })
  } else {
    layer.msg(res.data.message)
  }
})

var params = {
  current: 1,
  pagesize: 12,
  category: '',
  filter: '',
  saleType: 10,
  sortType: 'id',
  sortMethod: 'ASC',
  search: ''
};

$(".next").on('click', function () {
  params.current = params.current + 1
  $(".prev").removeClass('disable')
  loadGoodsList()
})

$(".prev").on('click', function () {
  params.current = params.current - 1;
  if (params.current === 1) {
    $(this).addClass('disable')
  }
  loadGoodsList()
})
function activateListItem(clickedItem, selector) {
  $(selector).find('.active').removeClass('active');
  $(clickedItem).addClass('active');
}
$('.category').on('click', 'li', function () {
  $('.category li.active').removeClass('active');
  $(this).addClass('active');
  var category = $(this).text()
  if(category=='全部'){
    params.category=''
  }else{
    params.category=category
  }
 
  loadGoodsList();
});

$('.saleBox li').click(function () {
  activateListItem(this, '.saleBox');
  params.saleType = $(this).data('type');
  params.current = 1;
  loadGoodsList();
});

$('.hotBox li').click(function () {
  activateListItem(this, '.hotBox');
  params.filter = $(this).data('type');
  params.current = 1;
  loadGoodsList();
});

$('.sortBox li').click(function () {
  activateListItem(this, '.sortBox');
  params.sortType = $(this).data('type');
  params.sortMethod = $(this).data('method');
  params.current = 1;
  loadGoodsList();
});

$('.search').blur(function () {
  params.search = $(this).val();
  params.current = 1;
  loadGoodsList();
});

$('.go').click(function () {
  var pageNum = parseInt($('.jump').val(), 10);
  if (!isNaN(pageNum)) {
    params.current = pageNum;
    loadGoodsList();
  }
});

$('.pagesize').change(function () {
  params.pagesize = parseInt($(this).val(), 10);
  params.current = 1;
  loadGoodsList();
});

function loadGoodsList() {
  axios.get('http://localhost:9000/goods/list', { params: params })
    .then(function (response) {
      if (response.data.code === 1) {
        var productListHTML = '';
        response.data.list.forEach(function (product) {

          productListHTML += `
            <li data-id="${product.goods_id}">
              <div class="show">
                <img src="${product.img_big_logo}">
                ${product.is_hot ? '<span class="hot">热销</span>' : ''}
                ${product.is_sale ? '<span>折扣</span>' : ''}
              </div>
              <div class="info">
                <p class="title">${product.title}</p>
                <p class="price">
                  <span class="curr">¥ ${product.current_price}</span>
                  <span class="old">¥ ${product.price}</span>
                </p>
              </div>
            </li>
          `;
        });

        $('.list.container').html(productListHTML);
        $('.total').text(params.current + '/' + response.data.total);
      } else {
        alert(response.data.message);
      }
    });
}

loadGoodsList();

$('.list').on('click', 'li', function () {
  var id = $(this).data('id');
  layui.data('goods', {
    key: 'id',
    value: id
  })
  location.href = './detail.html'
})